<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta http-equiv="Cache-Control" content="private">
		<meta content="telephone=no,email=no" name="format-detection">
		<meta content="yes" name="apple-mobile-web-app-capable">
		<meta http-equiv="Access-Control-Allow-Origin" content="*" />
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>添加银行卡</title>
		
		<link rel="stylesheet" href="./css/bootstrap/css/bootstrap.css">
		<script src="./js/lib/rem.js"></script>
		<script src="./js/lib/jquery-3.3.1.min.js"></script>
		<script src="./js/lib/common.js"></script>
	</head>
	<style>
		.addbank{width:100%;height:100%;background:#fff;position:fixed;}
		.head{width:100%;height:1rem;line-height:1rem;text-align:center;background:#0c5dac;position:relative}
		.head-back{width:20%;height:1rem;position:absolute;left:0;top:0;display:flex;flex-direction:row;align-items:center;justify-content:center;}
		.head-back > i.back{width:0.4rem;height:0.4rem;display:inline-block;background:url('./img/icons/left.png') no-repeat;background-size:0.4rem;}
		.head-back > span{font-size:0.3rem;color:#fff;}
		.head-title{width:100%;height:1rem;line-height:1rem;text-align:center;background:#0c5dac;}
		.head-title > span{font-size:0.34rem;color:#fff;}
		
		.addbank-content{width:92%;height:calc(100% - 1rem);margin:0.3rem 4% 0;}
		
		.addbank-content > div,.addbank-name{width:100%;height:0.8rem;margin-bottom:0.2rem;display:flex;flex-direction:row;border-bottom:0.02rem solid #ccc;}
		.addbank-content > div:last-child{border-bottom:none;}
		.addbank-name{justify-content:center;align-items:center;text-decoration:none !important;outline:none;}
		.addbank-content > div > span,.addbank-name > span{width:25%;height:0.8rem;line-height:0.8rem;text-align:center;font-size:0.26rem;color:#999;}
		.addbank-content > div > input,.addbank-name > input{width:75%;height:0.78rem;padding:0 3%;border:none;outline:none;font-size:0.28rem;color:#222;}
		.addbank-name > input{width:60%; !important;}
		.addbank-name > i.right{width:0.4rem;height:0.4rem;display:block;background:url('./img/icons/right.png') no-repeat;background-size:0.4rem;}
		.bank-username > span{width:30% !important;}
		.bank-username > input{width:70% !important;}
		
		
		
		.password-notice{display:none;width:100%;height:0.7rem;line-height:0.8rem;padding-left:3%;}
		.password-notice > span{font-size:0.28rem;color:#f00;}
		
		.update-btn{width:100%;height:0.8rem;margin-top:0.3rem;}
		.update-btn > button{width:80%;height:0.8rem;margin:0 auto;background:#217bd1;outline:none;border:none;color:#fff;font-size:0.32rem;border-radius:0.1rem;}
		
	</style>
	<body>
		<div class="addbank">
			<div class="head">
				<div class="head-back" onClick='javascript:history.go(-1);'>
					<i class="back"></i>
					<span>取消</span>
				</div>
				<div class="head-title">
					<span>添加银行卡</span>
				</div>
			</div>
			
			<div class="addbank-content">
				<a href="./bank-list.html" class="addbank-name">
					<span>开户银行：</span>
					<input type="text" readonly="readonly" placeholder="请选择开户银行">
					<i class="right"></i>
				</a>
				<div class="bank-section">
					<span>开户省市：</span>
					<input type="text" readonly="readonly" placeholder="请选择开户省市">
				</div>
				<div class="bank-subbranch">
					<span>支行名称：</span>
					<input type="text" placeholder="请输入支行名称">
				</div>
				<div class="bank-username">
					<span>持卡人姓名：</span>
					<input type="text" placeholder="请输入持卡人姓名">
				</div>
				<div class="bank-code">
					<span>银行卡号：</span>
					<input type="number" placeholder="请输入银行卡号">
				</div>
				
				<div class="update-btn">
					<button type="button">确认添加</button>
				</div>
				
			</div>

		</div>
	</body>
</html>